<template>
	<view>
		<view class="input_title">
			<view class="inputContent">
				<view class="btnRer">
					<view class="imgLeft">
						<image src="../static/image/search.png"></image>
					</view>
					<input v-model="inputConent" placeholder="请输入" />
				</view>
				<view class="imgRight">
					<image src="../static/image/rightA.png"></image>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
  name: "baseTab",
  props: {
    inputConent: {
      type: String,
      default: "label",
    },
  },
  data() {
    return {};
  },
  computed: {
   
  },
  methods: {
    changeTab(index) {
      this.$emit("changeTab", index);
    },
  },
};
</script>

<style lang="scss" scoped>
.input_title{
	width: 100%;
	height: 100%;
	line-height: 65rpx;
	.inputContent{
		display: flex;
		align-items: center;
		z-index: 3;
		width: 100%;
		background-image: url("../static/image/inputBack.png");
		/* 设置背景图片以覆盖整个元素 */
		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
		border-radius: 10rpx;
		.btnRer{
			display: flex;
			align-items: center;
			width: 82%;
			margin-left: 15rpx;
			.imgLeft{
				text-align: center;
				width: 10%;
				image{
					width: 24rpx;
					height: 25rpx;
				}
			}
			input{
				width: 80%;
				height: 100%;
				height: 65rpx;
				line-height: 65rpx;
				font-size: 21rpx;
				color: #A6A6A6;
			}
		}
		
		.imgRight{
			width: 5%;
			text-align: center;
			padding-top: 7.5rpx;
			height: 65rpx;
			line-height: 65rpx;
			image{
				width: 36rpx;
				height: 36rpx;
				overflow: hidden;
			}
		}
	}
}
</style>
